<template lang="html">
  <el-menu
    default-active="1"
    unique-opened
    :default-openeds="['1', '2', '3']"
    :default-active="defaultActive"
    router
  >
    <el-submenu v-for="item in menuData" :index="item.key" :key="item.key" >      <template slot="title">        <span>{{ item.title }}</span>      </template>      <el-menu-item-group v-for="menuItem in item.subMenuList" :key="menuItem.route" >        <el-menu-item :index="menuItem.route">{{ menuItem.title }}</el-menu-item>      </el-menu-item-group>    </el-submenu>
  </el-menu>
</template>

<script>
  import menuData from '../config/menu.js'
  
export default {
  data () {
    return {
      menuData,
      defaultActive: '/columnEdit'
    }
  },
  created () {
    const path = this.$route.fullPath
    this.defaultActive = path == '/' ? '/columnEdit' : path
  }
}
</script>

<style scoped >
  /deep/ .el-menu {
    border: none !important;
  }
</style>
